<template>
	<div class="home align-center">
		<img id="logo" src="../assets/logo.png" style="margin-top: 50px; margin-bottom: 30px;">
		<br>
		<el-input size="medium" placeholder="请输入内容" v-model="keyword" class="input-search" @change="query">
			<el-button slot="append" @click="query">搜索</el-button>
		</el-input>

		<channel-grid />
	</div>
</template>

<script>
	// @ is an alias to /src
	import ChannelGrid from '@/components/ChannelGrid.vue'

	export default {
		name: 'Home',
		components: {
			ChannelGrid
		},
		data() {
			return {
				keyword: ''
			}
		},
		mounted() {
			var openId = this.$route.query.openId;
			var access_token = this.$route.query.access_token;
			console.debug("QQ登录access_token", access_token);
		},
		methods: {
			query() {
				if (this.keyword == '') return false;
				this.$router.push({
					path: '/search',
					query: {
						keyword: this.keyword
					}
				})
			}
		}
	}
</script>

<style>
	.input-search.el-input-group {
		height: 46px !important;
		width: 50%;
	}

	.input-search .el-input__inner {
		height: 46px !important;
		border: 2px solid #F03726;
	}

	.input-search .el-input-group__append {
		background: #F03726 none repeat scroll 0% 0%;
		border: 2px solid #F03726;
		color: #F5F5F2;
		font-size: 18px;
	}
</style>
